<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="utf-8">
		<title></title>
		<!-- 基础样式 -->
		<link type="text/css" rel="stylesheet" href="/static/css/base.css"/>
		<!-- 公共样式 -->
		<link type="text/css" rel="stylesheet" href="/static/css/common.css" />
		<!-- 商品样式 -->
		<link type="text/css" rel="stylesheet" href="/static/css/product.css" />
		<!-- 引入favicon图标 -->
		<link rel="shortcut icon" href="/static/img/favicon.ico" />
		<!-- layui -->
		<link rel="stylesheet" href="/static/js/layui/css/layui.css" media="all">
	</head>
	<body>
		<!-- 快捷导航模块 start -->
		<section class="shortcut">
			<!-- 版心 -->
			<div class="w">
				<div class="nav_left">
					<ul>
						<li class="icon-phone">0797-3591053</li>
						<li></li>
						<li class="icon-app"><a href="#">下载Flower鲜花APP</a></li>
						<li></li>
						<li class="icon-wx"><a href="#">关注Flower鲜花微信公众号</a></li>
					</ul>
				</div>

				<div class="nav_right">
					<ul>
						<li class="avatar" th:if="${session.loginUser != null}"><img th:src="${session.loginUser.avatar}" alt="" style="width: 34px;height: 34px"></li>
						<li class="login" th:if="${session.loginUser != null}" style="margin-left: 5px">[[${session.loginUser.nickname}]]</li>
						<li class="login" th:if="${session.loginUser == null}"><a href="/login.html">登录</a></li>
						<li th:if="${session.loginUser == null}"><a href="/register.html">注册</a></li>
						<li th:if="${session.loginUser != null}" style="margin-left: 10px"><a href="/logout">退出</a></li>
						<li class="fenge"></li>
						<li class="shop_car"><a href="/shopCar.html">我的购物车</a><i class="count">0</i></li>
					</ul>
				</div>
			</div>
		</section>
		<!-- 快捷导航模块 end -->

		<!-- header头部模块 start -->
		<header class="header w">
			<!-- logo -->
			<div class="logo">
				<ul>
					<li>
						<h1>
							<a href="/index.jsp" title="Flower" class="Rosewin">Flower</a>
						</h1>
					</li>
					<li></li>
					<li class="arrow-icon"><a href="#">全国</a></li>
				</ul>
			</div>
			<!-- 搜索框 -->
			<div class="search">
				<input type="text" name="" id="" value="" 	placeholder="请输入关键字"/>
				<button><em></em></button>
			</div>
			<!-- 下载 -->
			<div class="download">
				<a href="#" class="ios"></a>
				<a href="#" class="android"></a>
			</div>
		</header>
		<!-- header头部模块 end -->

		<!--移入弹出层-->
		<div class="shiftInPopup">
			<ul class="kind" id="kind">
				<li><a href="/flower.html?categoryName=向日葵">向日葵</a></li>
				<li><a href="/flower.html?categoryName=康乃馨">康乃馨</a></li>
				<li><a href="/flower.html?categoryName=满天星">满天星</a></li>
				<li><a href="/flower.html?categoryName=白玫瑰">白玫瑰</a></li>
				<li><a href="/flower.html?categoryName=红玫瑰">红玫瑰</a></li>
				<li><a href="/flower.html?categoryName=蓝玫瑰">蓝玫瑰</a></li>
				<li><a href="/flower.html?categoryName=粉玫瑰">粉玫瑰</a></li>
			</ul>
		</div>

		<!-- nav 模块 start -->
		<nav class="nav">
			<div class="w">
				<div class="category">
					<ul>
						<li><a href="/index.html">首页</a></li>
						<li>/</li>
						<li><a href="http://localhost:8099/flower.html?categoryName=鲜花" class="selectFlower" id="flower">鲜花</a></li>
						<li>/</li>
						<li><a href="/flower.html?categoryName=进口鲜花">进口鲜花</a></li>
						<li>/</li>
						<li><a href="/cake.html?categoryName=蛋糕" class="cake">蛋糕<img src="/static/img/hot_ico3.gif" alt=""></a></li>
						<li>/</li>
						<li><a href="/flower.html?categoryName=永生花">永生花</a></li>
						<li>/</li>
						<li><a href="#">开业花篮</a></li>
						<li>/</li>
						<li><a href="#">礼品</a></li>
						<li>/</li>
						<li><a href="#">鲜花百科</a></li>
						<li>/</li>
						<li><a href="#">花语大全</a></li>
					</ul>
				</div>
			</div>
		</nav>
		<!-- nav 模块 end -->




		<!-- product 模块 start -->
		<div class="product">
			<div class="w">
				<div class="product_content">
					<div class="product_content_left">
						<div class="small_pic">
							<ul>
								<li></li>
								<li><img th:src="${product.picture}" alt="" width="70px" height="70px"></li>
								<li></li>
							</ul>
						</div>
						<div class="big_pic">
							<img th:src="${product.picture}" alt="" width="506px" height="506px">
						</div>
					</div>
					<div class="product_content_right">
						<div class="product_detail">
							<ul>
								<li>[[${product.productName}]]</li>
								<li>花赞价<span>￥[[${#numbers.formatDecimal(product.productPrice,1,2)}]]</span></li>
								<li>材&nbsp;&nbsp;&nbsp;料<span>[[${product.describes}]]</span></li>
								<li>包&nbsp;&nbsp;&nbsp;装<span>[[${product.packaging}]]</span></li>
								<li>花&nbsp;&nbsp;&nbsp;语<span>[[${product.detail}]]</span></li>
								<li>附&nbsp;&nbsp;&nbsp;赠<span>免费附送精美贺卡，代写您的祝福。</span></li>
								<li>配&nbsp;&nbsp;&nbsp;送<span>全国 （可配送至全国1000多个城市，市区免配送费）</span></li>
								<li>数&nbsp;&nbsp;&nbsp;量
									<div class="product_count">
										<div class="count_input"><input type="text" placeholder="1" value=1 id="count"></div>
										<div class="count_up"><a id="add"></a></div>
										<div class="count_down"><a id="sub"></a></div>
									</div>
								</li>
								<li style="display: none" id="productId">[[${product.id}]]</li>
								<li style="display: none" id="localhost"></li>
							</ul>
						</div>
						<div class="product_btn ">
							<ul>
								<li><a id="addProductToCart" class="addProductToCart">加入购物车</a></li>
								<li><a href="" id='buy' class="addProductToCart">即可购买</a></li>
								<li><a href="" id="collect"></a></li>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- product 模块 start -->





		<!-- footer 模块 start -->
		<footer class="footer">
			<div class="footer_service footer-wrap">
				<div class="w">
					<ul>
						<li>
							<h4></h4>
							<div class="service_text">
								<h2>高档花材</h2>
								<p>100%品质保证</p>
							</div>
						</li>
						<li>
							<h4></h4>
							<div class="service_text">
								<h2>同城配送</h2>
								<p>1-3小时送达</p>
							</div>
						</li>
						<li>
							<h4></h4>
							<div class="service_text">
								<h2>特色服务</h2>
								<p>高端私人定制</p>
							</div>
						</li>
						<li>
							<h4></h4>
							<div class="service_text">
								<h2>时尚原创花艺</h2>
								<p>资深花艺师独家设计</p>
							</div>
						</li>
					</ul>
				</div>
			</div>

			<div class="footer_bottom">
				<div class="w">
					<div class="help">
						<div class="footer_help">
							<dl>
								<dt>购物说明</dt>
								<dd><a href="#">APP专享介绍</a></dd>
								<dd><a href="#">购物流程</a></dd>
								<dd><a href="#">支付说明</a></dd>
							</dl>
							<dl>
								<dt>配送说明</dt>
								<dd><a href="#">配送范围</a></dd>
								<dd><a href="#">配送费用</a></dd>
								<dd><a href="#">配送时间</a></dd>
							</dl>
							<dl>
								<dt>退改须知</dt>
								<dd><a href="#">订单修改</a></dd>
								<dd><a href="#">订单取消</a></dd>
								<dd><a href="#">关于签收</a></dd>
							</dl>
							<dl>
								<dt>关于我们</dt>
								<dd><a href="#">品牌介绍</a></dd>
								<dd><a href="#">实力证明</a></dd>
								<dd><a href="#">花语大全</a></dd>
								<dd><a href="#">鲜花百科</a></dd>
							</dl>
							<dl>
								<dt>同层配送</dt>
								<dd><a href="#">北京鲜花</a></dd>
								<dd><a href="#">上海鲜花</a></dd>
								<dd><a href="#">广州鲜花</a></dd>
								<dd><a href="#">更多城市</a></dd>
							</dl>
						</div>
						<div>&nbsp;&nbsp;友情链接：&nbsp;&nbsp;<a href="#">订花</a>&nbsp;&nbsp;<a href="#">花店订花</a>&nbsp;&nbsp;<a href="#">防伪</a>&nbsp;&nbsp;<a href="#">网站建设</a>&nbsp;&nbsp;<a href="#">连锁加盟网</a>&nbsp;<a href="#">CFA</a>&nbsp;&nbsp;<a href="#">品牌大全</a>&nbsp;&nbsp;<a href="#">EMBA</a>&nbsp;&nbsp;<a href="#">资源网</a></div>
						<div>&nbsp;&nbsp;联系电话：&nbsp;&nbsp;0797-3591053&nbsp;&nbsp;&nbsp;©2021 - 2022 By 赖赐麒</div>
						<div>&nbsp;&nbsp;开发者：赖赐麒&nbsp;&nbsp;&nbsp;<a href="#">应用权限</a>&nbsp;&nbsp;<a href="#">隐私权限</a></div>
					</div>


					<div class="service_tel">
						<ul>
							<li>电话</li>
							<li>0797-3591053</li>
							<li>工作日 08:00-21:00</li>
							<li>节假日 06:00-24:00</li>
							<li><a href="#">全国</a></li>
						</ul>
					</div>


					<div class="download">
						<ul class="download_iphone">
							<li>Iphone下载</li>
							<li></li>
						</ul>
						<ul class="download_android">
							<li>Android下载</li>
							<li></li>
						</ul>
						<div>手机扫码即可下载Flower鲜花APP</div>
					</div>
				</div>
			</div>
		</footer>
		<!-- footer 模块 end -->
		<script src="/static/js/layui/layui.js"></script>
		<script src="/static/js/common.js" type="text/javascript" charset="utf-8"></script>
		<script src="/static/js/layui/jquery.min.js"></script>
		<script src="/static/js/product.js"></script>
		<script src="/static/js/common.js"></script>
	</body>
</html>
